.cdk-drag-preview {
  box-sizing: border-box;
  border-radius: 4px;
  box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2),
  0 8px 10px 1px rgba(0, 0, 0, 0.14),
  0 3px 14px 2px rgba(0, 0, 0, 0.12);
}

.cdk-drag-placeholder {
  opacity: 0;
}

.cdk-drag-animating {
  transition: transform 100ms cubic-bezier(0, 0, 0.2, 1);
}

.position {
  max-width: 4rem;
}

.group {
  max-width: 10rem;
}

.global-role {
  max-width: 6rem;
}

.controls {
  max-width: 8rem;
}

.namespace-role {
  border: 1px solid;
  border-radius: 4px;
  padding: 0 6px;
  font-size: 12px;
  margin: 4px 0;
}

mat-header-cell.controls {
  padding-left: 10px;
}

i {
  font-size: 16px;
}

.btn-add-to-top > .mat-button-wrapper {
  display: flex;
  align-items: center;
}

.badge.badge-outlined {
  background-color: transparent
}

.cdk-drag-handle {
  cursor: grab;
}

.cdk-drag-handle:active {
  cursor: grabbing;
}

.cdk-drag-preview .cdk-drag-handle {
  pointer-events: auto;
  cursor: grabbing;
}
